<script setup lang="ts">
import {
  onActivated,
  onBeforeMount,
  onBeforeUnmount,
  onBeforeUpdate,
  onDeactivated,
  onErrorCaptured,
  onMounted,
  onUnmounted,
  onUpdated,
} from 'vue'

onBeforeMount(() => {
  console.log('准备挂载')
})

onMounted(() => {
  console.log('已挂载')
})

onBeforeUpdate(() => {
  console.log('准备更新')
})

onUpdated(() => {
  console.log('已更新')
})

onBeforeUnmount(() => {
  console.log('准备卸载')
})

onUnmounted(() => {
  console.log('已卸载')
})

onActivated(() => {
  console.log('组件被激活')
})

onDeactivated(() => {
  console.log('组件被失活')
})

onErrorCaptured(() => {
  console.log('当捕获一个来自子孙组件的错误时被调用')
  return false // 阻止错误继续向上传播
})
</script>

<template>
  <div class="container">生命周期</div>
</template>

<style scoped lang="scss"></style>
